﻿@{
    ViewBag.Title = "Manage Roles";
    Layout = "~/Views/Shared/_Layout.Management.cshtml";
}

<h2 class="app">
	<strong>Quản lý vai trò người dùng</strong>
</h2>
<div class="title">
    <h3>Xem vai trò</h3>
</div>
<span class="paging">
    <span class="show">Hiển thị <input type="text" class="text" data-bind="value: PageSize" onkeypress="return isNumberKey(event)" /> trên trang</span>
    <span class="pages">Trang <input type="text" class="text" data-bind="value: CurrentPageIndex" onkeypress="return isNumberKey(event)" /> của <span data-bind="text: maxPageIndex"></span>
    <a href="##" class="btn btn-prev-arrow" data-bind="click: PrevButton, attr: {'class': PrevButtonClass}"></a>                            
    <a href="##" class="btn btn-next-arrow" data-bind="click: NextButton, attr: {'class': NextButtonClass}"></a>
    </span>
</span>
@*<div class="table table-leads manageusers">
	<div class="title">
		<div class="col1">
            <span class="w">
                <a href="#" data-bind='click: function(event) { SetOrder(event, "Name")}'>Tên vai trò</a>
                <div class="sort_wrapper" id="Name">  
                    <span class="grid_order ui_icon"></span>
                </div>               
            </span>
        </div>
		<div class="col1 col2">
            <span class="w">
                <a href="#" data-bind='click: function(event) { SetOrder(event, "ShortDescription")}'>Mô tả ngắn</a>
                <div class="sort_wrapper" id="ShortDescription">  
                    <span class="grid_order ui_icon"></span>
                </div>               
            </span>
        </div>
        <div class="col1 col3">
            <span class="w">
                <a href="#" data-bind='click: function(event) { SetOrder(event, "LongDescription")}'>Mô tả thêm</a>
                <div class="sort_wrapper" id="LongDescription">  
                    <span class="grid_order ui_icon"></span>
                </div>               
            </span>
        </div>
		<div class="col1 col12 centeralign"><span class="w">Hành động</span></div>
	</div>
    <div class="linegroup" data-bind="foreach: ItemsOnPage">
        <div class="line">
		    <div class="col1"><span class="w" data-bind="text: Name"></span></div>
		    <div class="col1 col2"><span class="w" data-bind="text: ShortDescription"></span></div>
            <div class="col1 col3"><span class="w" data-bind="text: LongDescription"></span></div>
		    <div class="col1 col12 centeralign">
                <span class="w">
                    Không
                </span>
            </div>
	    </div>
    </div>
</div>*@

<table class="tablegrid" cellspacing="0" border="0">
    <thead>
        <tr class="title">        
		    <th>
                <span class="w" style="height:22px">
                    <a href="#" data-bind='click: function(event) { SetOrder(event, "Name")}'>Tên vai trò</a>
                    <div class="sort_wrapper" id="Name">  
                        <span class="grid_order ui_icon"></span>
                    </div>                                        
                </span>
            </th>   
		    <th>
                <span class="w" style="height:22px">
                    <a href="#" data-bind='click: function(event) { SetOrder(event, "ShortDescription")}'>Mô tả ngắn</a>
                    <div class="sort_wrapper" id="ShortDescription">  
                        <span class="grid_order ui_icon"></span>
                    </div>                                        
                </span>
            </th> 
		    <th>
                <span class="w" style="height:22px">
                    <a href="#" data-bind='click: function(event) { SetOrder(event, "LongDescription")}'>Ghi chú</a>
                    <div class="sort_wrapper" id="CreationDate">  
                        <span class="grid_order ui_icon"></span>
                    </div>                                        
                </span>
            </th>
        </tr>
    </thead>
    
    <tbody data-bind="foreach: ItemsOnPage">
        <tr class="line">
		    <td>
                <span class="w" data-bind="text: Name"></span>
            </td> 
            <td>
                <span class="w" data-bind="text: ShortDescription"></span>
            </td>
            <td>
                <span class="w" data-bind="text: ShortDescription"></span>
            </td>
	    </tr>
    </tbody>
</table>

<script type="text/javascript">
    var data = @(Html.Raw(Json.Encode(Model)));
</script>
<script src="/Scripts/ViewModel/rolegrid.js" type="text/javascript"></script>
